<template>
  <div>
    <!-- 顶行图片 -->
    <img src="../assets/Images/1.jpg" width="100%" alt="" />
    <!-- 病毒信息 -->
    <CovInfo :covDesc="covDesc" :covNews="covNews"></CovInfo>

    <!-- 疫情-小导航 -->
    <div class="list">
      <van-row type="flex" justify="space-around">
        <van-col span="4">
          <router-link to="Danger">
            <img src="../assets/Images/1.png" width="80px" alt="" />
            <div>风险地区</div>
          </router-link>
        </van-col>
        <van-col span="4">
          <router-link to="NucleicAcidTest">
            <img src="../assets/Images/2.png" width="80px" alt="" />
            <div>核酸检测</div>
          </router-link>
        </van-col>
        <van-col span="4">
          <router-link to="Material">
            <img src="../assets/Images/3.png" width="80px" alt="" />
            <div>物资防疫</div>
          </router-link>
        </van-col>
        <van-col span="4">
          <img src="../assets/Images/4.png" width="80px" alt="" />
          <div>出行政策</div>
        </van-col>
      </van-row>
    </div>
    <!-- 数据统计 -->
    <CovData :covNum="covNum"></CovData>
    <van-divider />
  </div>
</template>

<script>
import CovInfo from "./CovInfo/CovInfo.vue";
import CovData from "./CovInfo/CovData.vue";
import api from "../API/index";
export default {
  components: {
    CovInfo: CovInfo,
    CovData: CovData,
  },
  data() {
    return {
      covDesc: {},
      covNews: [],
      covNum: {},
    };
  },
  created() {
    api.getCovInfo().then((res) => {
      //病毒信息的介绍信息
      let data = res.data.newslist[0].desc;
      this.covDesc = {
        note1: data.note1,
        note2: data.note2,
        note3: data.note3,
        remark1: data.remark1,
        remark2: data.remark2,
        remark3: data.remark3,
      };
      //疫情热点信息
      this.covNews = res.data.newslist[0].news;
      //疫情数据
      this.covNum = {
        confirmedCount: data.confirmedCount,
        confirmedIncr: data.confirmedIncr,
        suspectedCount: data.suspectedCount,
        suspectedIncr: data.suspectedIncr,
        seriousIncr: data.seriousIncr,
        seriousCount: data.seriousCount,
        curedCount: data.curedCount,
        curedIncr: data.curedIncr,
        currentConfirmedIncr: data.currentConfirmedIncr,
        deadIncr: data.deadIncr,
        deadCount: data.deadCount,
        currentConfirmedCount: data.currentConfirmedCount,
        createTime: data.createTime,
      };
      console.log(data);
    });
  },
};
</script>

<style scoped>
.list {
  text-align: center;
  margin-bottom: 0.2rem;
}
</style>